/**
 * 详情页面相关的函数
 */
let itemId = undefined;

let spes = undefined; //  保存所有的规格

function loadItem() {
    // 从地址栏获取商品的编号
    itemId = location.search.substring(1).split("=")[1];
    // 发送请求
    axios.get(config.BASURL + "/manager/item/get/" + itemId)
        .then(res => {
            let data = res.data;
            console.log(data);
            let item = data.data;
            // 商品的基本信息显示-------------
            $("#item-title").text(item.title);
            $("#item-price").text(item.price / 100);
            $("#item-sellpoint").text(item.sellPoint);

            // 商品的图片处理 --------------------
            // 清空原来的图片
            $("#item-image-list").empty();
            $("#big_img").attr("src", "");
            // 图片要处理一下 获取出我们的图片
            let images = item.image.split(";");
            for (let x = 0; x < images.length; x++) {
                if (x == 0) {
                    $("#big_img").attr("src", images[x]);
                    $("#item-image-list").append(`<li><a href="javascript:void(0);" class="cur" simg="${images[x]}"><img src="${images[x]}" width="58" height="58"></a> </li>`);
                } else {
                    $("#item-image-list").append(`<li><a href="javascript:void(0);" simg="${images[x]}"><img src="${images[x]}" width="58" height="58"></a> </li>`);
                }
            }

            // 规格处理----------
            // 清空之前的规格
            $("#item-spes").empty();
            // 获取出我们查询的规格
            spes = item.spes;
            for (let x = 0; x < spes.length; x++) {
                let spe = spes[x];
                // 拼接一个规格的html代码
                let html = `<div class="attrdiv pc-telling clearfix">
            <div class="pc-version">${spe.speName}</div>
            <div class="pc-adults qd-spe">
                <ul>`
                // 获取规格的entry
                let entrys = spe.entrys;
                // 遍历entrys
                for (let i = 0; i < entrys.length; i++) {
                    let entry = entrys[i];
                    if (entry.entryImg) {
                        html += `<li><a speId="${spe.speId}" entryId="${entry.entryId}" href="javascript:void(0);" title="${entry.entryText}" ${i == 0 ? 'class="cur"' : ''}><img src="${entry.entryImg}" width="35" height="35"></a> </li>`
                    } else {
                        html += `<li><a speId="${spe.speId}" entryId="${entry.entryId}" href="javascript:void(0);" ${i == 0 ? 'class="cur"' : ''}>${entry.entryText}</a> </li>`
                    }
                }
                html + `</ul>
                </div>
            </div>`;
                $("#item-spes").append(html);
            }

            //  商品的详情显示
            $("#item-desc").html(item.itemDesc.itemDesc);

            // 调用绑定事件的函数
            bindSomeEvent();
        });
}
/**
 * 数据加载完成之后绑定事件
 */
function bindSomeEvent(){
    // 图片切换的事件
    $("#item-image-list a img").click(function(){
        $("#big_img").attr("src",$(this).attr("src"));
        $("#item-image-list a").removeClass('cur');
        $(this).parent().addClass("cur");
    });

    // 选择规格的事件
    $(".qd-spe ul li a").click(function(){
        let speId = $(this).attr("speId");
        let entryId = $(this).attr("entryId");
        // 删除同一类规格的被选中的样式
        $(this).parent().parent().find("li a").removeClass('cur');
        $(this).addClass("cur");

        // 找到被选中的规格
        for(let x = 0;x < spes.length;x ++){
            if(spes[x].speId == speId){
                let currSpe = spes[x];
                // 修改这个规格中的所有规格项的被选中的状态属性。
                let entrys = currSpe.entrys;
                entrys.forEach((entry)=>{
                    if(entry.checked){
                        entry.checked = false;
                    }
                    if(entry.entryId == entryId){
                        entry.checked = true;
                    }
                });
                break;
            }
        }
        console.log(spes);
    });

}

// 使用自执行函数初始化页面
(function () {
    loadItem();
})();